// 帮扶措施弹窗的charts
// <!--轮询-->

var chart = echarts.init(document.getElementById('bfone-pop-up-charts'));

// chart.showLoading();//显示等待条
// //设置图表显示的内容

// $('.mb-r-con').resize(function(){
//     chart.resize();
//     //当id为main的div大小变化时的处理函数写在这里.....
//     //当然了#main只不过是id选择器，你也可以换成任何jquery的选择器......
// });

window.addEventListener('resize', function(){
    chart.resize();
})
var option = {

    label:{
        color: '#333',
    },
    tooltip: {
        trigger: 'axis',
        axisPointer: {
            type: 'cross',
            crossStyle: {
                color: '#333'
            }
        }
    },
    toolbox: {
        show:false,
        feature: {
            dataView: {show: true, readOnly: false},
            magicType: {show: true, type: ['line', 'bar']},
            restore: {show: true},
            saveAsImage: {show: true}
        }
    },
    grid: {
        bottom:80,
        left:40,
        right:45,
    },
    legend: {
        selectedMode: false,//不可点击
        data:['帮扶人数','帮扶天数'],
        textStyle: {
            color: '#333'
        }
    },
    xAxis: [

        {
            type: 'category',
            data: ['苏家营乡','堤村乡','官亭镇','观寨乡','巨鹿县','王虎寨镇','小吕寨镇','阎瞳镇','西郭城镇','张王瞳乡'],
            axisPointer: {
                type: 'shadow',
            },
            axisLabel: {
                interval:0,
                rotate:-40,
                show: true,
                textStyle: {
                    color: '#333'
                }
            }
        }
    ],
    yAxis: [
        {
            type: 'value',
            name: '',
            min: 0,
            max: 120,
            interval: 20,
            axisLabel: {
                formatter: '{value}',
                textStyle: {
                    color: '#333'
                }
            }
        },
        {
            type: 'value',
            name: '',
            min: 0,
            max: 120,
            interval: 20,
            axisLabel: {
                formatter: '{value}',
                textStyle: {
                    color: '#333'
                }
            }
        }
    ],
    series: [

        {
            name:'帮扶人数',
            type:'bar',
            itemStyle: {
                //通常情况下：
                normal: {
                    //每个柱子的颜色即为colorList数组里的每一项，如果柱子数目多于colorList的长度，则柱子颜色循环使用该数组
                    color: '#03b4de'
                },
            },
            barCateGoryGap:20, //关键第二句：值或为百分比 ‘60%’ ，如果同一类目下的柱间距：barGap:20
            data:[45, 27, 56, 22, 34, 2, 52, 18,43, 18]
        },
        {
            name:'帮扶天数',
            type:'line',
            yAxisIndex: 1,
            itemStyle : {
                normal: {
                    label : {

                        show: true,
                    },
                    lineStyle:{
                        color:'#a8690e'
                    },
                    color:'#333',
                }
            },
            data:[56, 54, 78, 56, 43, 100, 57, 78, 45, 78]
        }
    ]
};
// 使用刚指定的配置项和数据显示图表。
chart.setOption(option);
//两秒后关闭等待进度条
setTimeout(function () {
    chart.hideLoading();//隐藏等待条
}, 2000);
